<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
  <title>新华炫闻</title>
  <style>
  body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin: 0; padding: 0;}
  body,button,input,select,textarea {font:12px/1.4 Arial,Helvetica,'Hiragino Sans GB','Microsoft YaHei',sans-serif;color:#333}
  h1,h2,h3,h4,h5,h6 {font-size: 100%;}
  ul,ol {list-style: none;}
  table {border-collapse: collapse; border-spacing:0}
   img {border:0}
  .left{float:left;}
  .right{float:right;}
  .clearfix:after {content: '\20';display: block;height: 0;clear: both; }
  .clearfix {*zoom: 1;}

html{background-color:#f4f4f4;font-size:10px;font-family:Microsoft YaHei}

.category_logo{position:absolute;top:1.128rem;left:0;width:6.025rem;height:2.307rem;background-color:#00aaec;color:#fff;font-size:1.282rem;text-align:right;padding-right:0.641rem;line-height:2.307rem;}
.header{border-bottom:1px #999 solid;position:Relative;height:3.846rem;margin:0 1.153rem 1.769rem}
.news{margin-left:1.153rem;overflow:hidden;}
.news .item{float:left;height:4.871rem;width:11.153rem;margin-right:0.41rem;margin-bottom:0.41rem;position:relative;border:0.128rem #cdcdcd solid;overflow:hidden;}

.news .item.current{border-color:#00aaec}

.news .item img{display:block;width:10.769rem;height:5.512rem;margin:0.128rem auto}
.news .item h3{font-size:0.87rem;margin: 0 0.256rem 0.23rem 0.256rem;font-weight:normal;}
.news .item h4{font-size:0.615rem;color:#888;font-weight:normal;margin:0 0.256rem 0.23rem 0.256rem;}
.news .item h5{font-size:0.615rem;color:#333;font-weight:normal;margin:0 0.256rem 0.23rem 0.256rem}
.news .item.bold_item{height:10.41rem;}


.page{margin-top:1.2rem;text-align:right;margin-right:1.153rem}

.page .btn{display:inline-block;width:1.538rem;height:1.538rem;background:url(<?php echo __STATIC_IMAGE_URL__;?>images/arrow.png) no-repeat;background-size:6.152rem 1.538rem;margin-left:1.538rem}
#prevBtn{background-position:0 0}
#prevBtn.current{background-position:-1.538rem 0}
#nextBtn{background-position:-3.076rem 0}
#nextBtn.current{background-position:-4.614rem 0}

  </style>
  <script src="<?php echo __STATIC_IMAGE_URL__;?>js/jquery-1.9.1.min.js"></script>
 </head>
 <body>
<?php
$offset=12;
$published=0;

$catid = $_GET['catid'];
$name  = $_GET['name'];
if (!empty($name))
{
	$name = trim($name);
}
if($catid==27){

	$where =" `catid`=" . $catid . " AND `type` = 0 ";

}else{

	$where = " `catid`=" . $catid . " AND `status`=2 AND `posids`=0 AND `isdelete`=1 AND `isdisplay`=0 and `newstype`=0 ";

}


$published = 0;
if (isset($_GET['published']))
{
	$published = $_GET['published'];
}	

$type = '';
if (isset($_GET['type']))
{
	$type = $_GET['type'];
}

$page = 1;
$start_page=1;
$next_page=2;

$totalCount = 0;
XINHUA::lib('NEWS');
if ( $catid == 27 )
{
	$totalCount = NEWS::recommendTotal($where, $catid);
}
else
{
	$totalCount = NEWS::TOTAL($where);
}
//由于只显示整数页，所以分页不用ceil函数了
$pageSize = intval($totalCount / $offset);

if ($type == 'before')
{
	//$where .= " AND `published` > " . $published;
	//$page = $_REQUEST['page'];
	$page = $_GET['page'];
	$start_page = $page - 1;
	$next_page = $page + 1;

	if ($page <= 1) {
		$start_page = 1;
		$next_page = 2;
		$page  = 1;
	}


	if ($page >= $pageSize) {
		$page = 1;
		$start_page = 1;
		$next_page = 2;
	}

}
else if ($type == 'after')
{
	//$page = $_REQUEST['page'];
	$page = $_GET['page'];
	$start_page = $page -1;
	$next_page = $page + 1;

	if ($page >= $pageSize) {
		$page = $pageSize;
		$next_page = $pageSize;
		$start_page = $pageSize - 1;
	
	}

	if ($start_page < 1) {
		$start_page = 1;
	}
}	

if($catid==27){

	$data = NEWS::RECOMMEND($where, $offset, $page, array(), 27, '' , '');

}else{

	$data = NEWS::LISTDATA($where, $offset, $page, array(), 0, '', '');

}



?>

 <div class="header"></div>
  <div class="category_logo"><?php echo $name; ?></div>


 <div class="news" id="news">
<?php 
	


	$i = 0;
    $start_time = 0;
    $end_time   = 0; 
	foreach ($data as $v) {
	
		if ($i == 0) {
			$start_time = $v['published'];
		}

		$end_time = $v['published'];

		$newsid = $v['newsId'];
		$published = $v['published'];
		$datestr = ""; 
		if (!empty($published))
		{
			$datestr = date('Y-m-d H:i:s', $published);
		}
		$i++;
	
?> 	
		<div class="item" target-url="<?php echo __STATIC_IMAGE_URL__;?>letv/detail?newsid=<?php echo $newsid; ?>">
			<h3><?php echo $v['title']; ?></h3>
			<h4><?php echo $v['showSource']; echo "&nbsp;"; echo $datestr; ?> </h4>
		</div>
<?php 
	}

	$before_url = __STATIC_IMAGE_URL__ . "letv/category?type=before&catid=" . $catid . "&name=" .$name . "&published=" . $start_time . "&page=" . $start_page ;
	$after_url  =  __STATIC_IMAGE_URL__ . "letv/category?type=after&catid=" . $catid . "&name=" . $name . "&published=" . $end_time . "&page=" . $next_page ;
?>

 </div>

<div class="page" id="page">
<div class="btn" id="prevBtn" eIndex="12"  target-url="<?php echo $before_url; ?>"></div>
<div class="btn" id="nextBtn" eIndex ="13" target-url="<?php echo $after_url; ?>"></div>
</div>


<script>
//var index= getSearch().focusIndex || 0;

//var index= getCookie('subIndex2') || 1;
var index = getCookie("subIndex2") || 0;
//var index= getCookie('subIndex2') ;

var current = $('.current').length;
console.log('current:  '+current)

var $elements= $("#news .item");

var length= $elements.length;
var cols= 4;
var rows= length / cols;

function getSearch(href) {
          href = href || window.location.search;
          console.log('href:   '+href)
          var data = {},reg = new RegExp( "([^?=&]+)(=([^&]*))?", "g" );
          href && href.replace(reg,function( $0, $1, $2, $3 ){
              data[ $1 ] = $3;
          });

                    console.log('data:   '+data)

          return data;
}


function switchPage(i){
		if(i>= length){
			//setCookie("subIndex2",0,1);
			/*焦点处于上下翻按钮，焦点停留在一页的上下翻按钮*/
			 setCookie("subIndex2",i,1);

			//test by robin 
			history.replaceState({page: 1}, "title 1", "http://letv.qnsaas.cn/letv/index");

		   location.href=  $("[eIndex='"+i+"']").attr("target-url") ;
		}else{
		   //location.href = location.href + '&cateIndex='+i;
		   //window.location.pathname= i;
		   setCookie("subIndex2",i,1);
           location.href =  $elements.eq(i).attr("target-url") + "&prevurl="+ encodeURIComponent( location.href+"&focusIndex="+ i);
	
		}
}

function setFocus(i){
	console.log('i:'+i);
	if(i>= length){
		$elements.removeClass("current");
	    $("#page .btn").removeClass("current");
		$("[eIndex='"+i+"']").addClass("current");
	}else{
		$elements.removeClass("current");
	    $("#page .btn").removeClass("current");
         $elements.eq(i).addClass("current");
	}
}

function keyDownHandler(e){
	 e.preventDefault();
  switch(e.keyCode){
    case 39:   //right
	    if(index==13) {  
			switchPage(index)
		}else if(index != length-1){
			  index++;
			  setFocus(index)
		}
	break;
	case 37:   //left
		if(index==12) {  
			switchPage(index)
		}else if(index > 0){
			  index--;
			  setFocus(index)
		}
	break;
	case 40:   //down
	    index=index-0;
	   if(index < length){
		   if( index+cols < length){ index+= cols }else{index= length}
		   setFocus(index)
		}
	break;
	case 38:   //up
		if(index >= length){
			index= length-1;
		}else{
			if( index- cols >= 0) index -= cols;
		}
		setFocus(index)
	break;
	case 13:
        switchPage(index)
	break;
	case 8:
       location.href="/letv/index";
	break;

  
  }

}


function setCookie(name, value, expireday) {
	var exp = new Date();
	exp.setTime(exp.getTime() + expireday*24*60*60*1000); 
	document.cookie =name+"="+escape(value)+"; expires"+"="+exp.toGMTString();  
}

function getCookie(name) {
	var cookieStr = document.cookie;
	if(cookieStr.length > 0) {
		var cookieArr = cookieStr.split(";"); 
		for (var i=0; i<cookieArr.length; i++) {
			var cookieVal = cookieArr[i].split("=");
			if(cookieVal[0].trim() == name) {
				return unescape(cookieVal[1]); 
			}
		}
	}
}

//window.onpopstate = function(event) {
 // location.href='/letv/index';
//};

//history.replaceState({page: 1}, "title 1", window.location.search);


setFocus(index);
$(document).keydown(keyDownHandler);

//78px/3840
(function (doc, win) {
	var docEl = doc.documentElement,
	resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
	recalc = function () {
			var clientWidth = docEl.clientWidth;
			if (!clientWidth) return;
			docEl.style.fontSize = 78 * (clientWidth / 3840 ) + 'px';
	};

	if (!doc.addEventListener) return;
	win.addEventListener(resizeEvt, recalc, false);
	doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
</script>


 </body>
</html>
